@extends('layouts.header')
@section('content')
    <article class="page-container">
        <form class="form form-horizontal" id="form" autocomplete="off" >
            <div class="row cl">
                <label class="form-label col-sm-3">旧密码：</label>
                <div class="formControls col-sm-9">
                    <input type="password" class="input-text" value="" name="oldpassword" id="oldpassword" >
                </div>
            </div>
            <div class="row cl">
                <label class="form-label col-sm-3">新密码：</label>
                <div class="formControls col-sm-9">
                    <input type="password" class="input-text" value="" name="password" id="password" >
                    <label style="color: #999!important;">必须同时包含大小写字母和数字，长度在8-30之间</label>
                </div>
            </div>
            <div class="row cl">
                <label class="form-label col-sm-3">确认密码：</label>
                <div class="formControls col-sm-9">
                    <input type="password" class="input-text" value="" name="repassword" id="repassword" >
                </div>
            </div>

            @csrf

            <div class="row cl pt-20">
                <div class="col-sm-9 col-sm-offset-3">
                    <input class="btn btn-primary radius" type="submit" value="&nbsp;&nbsp;提交&nbsp;&nbsp;">
                    <input class="btn btn-danger radius ml-15" type="button" value="&nbsp;&nbsp;取消&nbsp;&nbsp;" onclick="layer_close();">
                </div>
            </div>
        </form>
    </article>
    <script type="text/javascript">
        $(function(){
            
            var index2;

            $('.skin-minimal input').iCheck({
                checkboxClass: 'icheckbox-blue',
                radioClass: 'iradio-blue',
                increaseArea: '20%'
            });
            
            $("#form").validate({
                rules:{
                    oldpassword:{
                        required:true,
                    },
                    password:{
                        required:true,
                        pwdIsOk:true,
                    },
                    repassword:{
                        required:true,
                        equalTo:"#password"
                    },
                },
                // onkeyup:false,
                // focusCleanup:false,
                success:"valid",
                submitHandler:function(form){
                    let arr = ['oldpassword','password','repassword'];
                    for (let i in arr) {
                        $('input[name='+arr[i]+']').val(btoa($('input[name='+arr[i]+']').val()));
                    }
                    $(form).ajaxSubmit({ 
                        type: 'post', 
                        url: "",//自己提交给自己可以不写url   
                        //beforeSend  beforeSubmit
                        beforeSubmit : function () { 
                            
                            //0.4透明度 白色遮罩
                            index2 = layer.load(2,{ shade: [0.3,'#fff'] }); 
                        },
                        complete : function () { 
                            layer.close(index2); 
                        },
                        success: function(data) {
                            //判断添加结果 
                            if(data === '1'){ 
                                parent.layer.msg('操作成功!',{ icon: 1, time:2000 });
                                parent.location.reload();//关闭自己
                            }else if(data === '2'){ 
                                layer.msg('旧密码错误!',{ icon: 2, time:2000 });
                            }
                            else{
                                layer.msg(data == 0 ?'操作失败!' :data, { icon: 2, time: 2000 }); 
                            } 
                        }, 
                        error: function(data) {
                            if (data.status==422) {
                                // var json=JSON.parse(data.responseText);
                                var json=$.parseJSON(data.responseText);
                                allError='';
                                $.each(json.errors,function (index,el) {
                                    allError += el + '<br>'; 
                                });
                                //输出错误信息 
                                layer.open({
                                    content:allError,
                                    title:false,
                                    type: 0,
                                    icon: 5,
                                    // skin: 'layui-layer-molv',
                                    btn:'',
                                    closeBtn: 2, //右上角关闭按钮风格  0无,1默认,2
                                    shadeClose: true, //开启遮罩关闭
                                    time:0,
                                    anim: 6,//弹出动画
                                });    
                            } else {
                                console.log(data);
                                ajax_error(data);
                            }
                        }///error---end
                    }); 
                }
            });
        });
    </script>
@endsection